<!DOCTYPE html>
<html lang="zh-CN">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>PTCG</title>
    <style>
        body {
            font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
            background: #f7f7f7;
            margin: 0;
            padding: 0;
        }

        .main-flex {
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-items: flex-start;
            min-height: 100vh;
            width: 100vw;
        }

        .player-container {
            background: #fff;
            margin-top: 40px;
            padding: 32px 24px 24px 24px;
            border-radius: 12px;
            box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
            width: 350px;
            min-height: 600px;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .player1 {
            margin-right: 40px;
        }

        .player2 {
            margin-left: 40px;
        }

        h2 {
            margin-top: 0;
            text-align: center;
        }

        input[type="text"] {
            width: 100%;
            padding: 10px;
            font-size: 16px;
            border: 1px solid #ccc;
            border-radius: 6px;
            margin-bottom: 16px;
        }

        .btn {
            width: 100%;
            padding: 10px;
            font-size: 16px;
            /* background: #1976d2; */
            /* color: #fff; */
            /* border: none; */
            border: 1px solid black;
            border-radius: 6px;
            cursor: pointer;
            transition: background 0.2s;
            margin-bottom: 8px;
        }

        .btn:hover {
            background: #1565c0;
            color: #fff;
        }

        .deck-area {
            background: #fff;
            margin-top: 20px;
            padding: 24px 20px 20px 20px;
            border-radius: 12px;
            box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
            width: 260px;
            min-height: 200px;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .deck-btns {
            width: 100%;
            display: flex;
            flex-direction: column;
            gap: 8px;
            margin-bottom: 18px;
        }

        .deck-list {
            margin-top: 24px;
            background: #f1f8ff;
            border-radius: 8px;
            padding: 16px;
            min-height: 40px;
            width: 100%;
        }

        .deck-list ul {
            padding-left: 20px;
            margin: 0;
        }

        .deck-list li {
            font-size: 15px;
            margin-bottom: 4px;
        }

        /* 看牌弹窗样式 */
        .modal {
            display: none;
            position: fixed;
            z-index: 1000;
            left: 0;
            top: 0;
            width: 100vw;
            height: 100vh;
            background: rgba(0, 0, 0, 0.3);
            justify-content: center;
            align-items: center;
        }

        .modal-content {
            background: #fff;
            padding: 24px 32px;
            border-radius: 10px;
            min-width: 300px;
            max-width: 90vw;
            max-height: 80vh;
            overflow-y: auto;
        }

        .modal-content h3 {
            margin-top: 0;
        }

        .modal-content ul {
            list-style: none;
            padding: 0;
        }

        .modal-content li {
            margin-bottom: 8px;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .choose-btn {
            background: #43a047;
            color: #fff;
            border: none;
            border-radius: 4px;
            padding: 4px 10px;
            cursor: pointer;
            font-size: 14px;
        }

        .choose-btn:hover {
            background: #2e7031;
        }

        .close-btn {
            background: #e53935;
            color: #fff;
            border: none;
            border-radius: 4px;
            padding: 4px 10px;
            cursor: pointer;
            font-size: 14px;
            margin-bottom: 10px;
        }

        .close-btn:hover {
            background: #ab000d;
        }

        .reward-area {
            position: fixed;
            bottom: 32px;
            left: 32px;
            background: #e3f2fd;
            border: 2px solid #90caf9;
            border-radius: 10px;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
            padding: 18px 24px 18px 24px;
            min-width: 180px;
            z-index: 100;
        }

        .reward-area.p2 {
            left: auto;
            right: 32px;
        }

        .reward-title {
            font-weight: bold;
            margin-bottom: 8px;
        }

        .reward-btn {
            width: 100%;
            padding: 8px;
            font-size: 15px;
            /* background: #1976d2; */
            /* color: #fff; */
            /* border: none; */
            border: 1px solid black;
            border-radius: 6px;
            cursor: pointer;
            margin-top: 10px;
            transition: background 0.2s;
        }

        .reward-btn:hover {
            background: #1565c0;
            color: #fff;
        }

        .discard-area {
            position: fixed;
            left: 32px;
            bottom: 295px;
            background: #e3f2fd;
            border: 2px solid #90caf9;
            border-radius: 10px;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
            padding: 18px 24px 18px 24px;
            min-width: 180px;
            z-index: 100;
        }

        .discard-area.p2 {
            left: auto;
            right: 32px;
        }

        .discard-title {
            font-weight: bold;
            margin-bottom: 8px;
        }

        .discard-btn {
            width: 100%;
            padding: 8px;
            font-size: 15px;
            /* background: #1976d2;
            color: #fff;
            border: none; */
            border: 1px solid black;
            border-radius: 6px;
            cursor: pointer;
            margin-top: 10px;
            transition: background 0.2s;
        }

        .discard-btn:hover {
            background: #1565c0;
            color: #fff;
        }

        .battle-area {
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-items: center;
            margin: 24px 0 0 0;
            padding-top: 200px;
            /* width: 100%; */
        }

        #battleArea1 {
            margin-right: 10px;
        }

        #battleArea2 {
            margin-left: 10px;
        }

        #battleArea2 .battle-right {
            margin-right: 32px;
            margin-left: 0px;
        }

        .battle-left {
            display: flex;
            flex-direction: row;
            gap: 8px;
        }

        .battle-slot {
            width: 54px;
            min-height: 74px;
            background: #e3f2fd;
            border: 2px solid #90caf9;
            border-radius: 8px;
            display: flex;
            align-items: flex-start;
            justify-content: center;
            font-size: 15px;
            cursor: pointer;
            transition: border 0.2s;
            position: relative;
            flex-direction: column;
        }

        .battle-slot-inner {
            display: flex;
            flex-direction: column;
            width: 100%;
            align-items: center;
            margin-top: 16px;
        }

        .battle-slot:hover {
            border: 2px solid #1976d2;
        }

        .battle-right {
            margin-left: 32px;
        }

        .battle-label {
            position: absolute;
            top: 2px;
            left: 4px;
            font-size: 12px;
            color: #1976d2;
            opacity: 0.7;
        }

        .battle-card {
            font-weight: bold;
            color: #1976d2;
            text-align: center;
            word-break: break-all;
            /* display: flex; */
            align-items: center;
            gap: 4px;
        }

        .battle-card-btn {
            background: #bdbdbd;
            color: #fff;
            border: none;
            border-radius: 3px;
            padding: 2px 6px;
            font-size: 12px;
            margin-left: 2px;
            cursor: pointer;
            z-index: 999;
        }

        .battle-card-btn:hover:enabled {
            background: #616161;
        }

        .battle-card-btn:disabled {
            opacity: 0.4;
            cursor: not-allowed;
        }

        .battle-empty {
            color: #b0bec5;
            font-size: 13px;
        }

        .battle-modal-list {
            list-style: none;
            padding: 0;
            margin: 0;
        }

        .battle-modal-list li {
            margin-bottom: 8px;
            display: flex;
            align-items: center;
            justify-content: space-between;
        }

        .battle-modal-btn {
            background: #1976d2;
            color: #fff;
            border: none;
            border-radius: 4px;
            padding: 4px 10px;
            cursor: pointer;
            font-size: 14px;
        }

        .battle-modal-btn:hover {
            background: #1565c0;
            color: #fff;
        }

        .battle-damage {
            width: 100%;
            text-align: center;
            color: #d32f2f;
            font-size: 13px;
            font-weight: bold;
            margin-top: 2px;
            margin-bottom: 2px;
        }

        .battle-damage-btn {
            background: #d32f2f;
            color: #fff;
            border: none;
            border-radius: 4px;
            padding: 2px 8px;
            font-size: 12px;
            margin-bottom: 2px;
            cursor: pointer;
        }

        .battle-damage-btn:hover {
            background: #b71c1c;
        }

        .stadium-area {
            position: fixed;
            bottom: 32px;
            left: 270px;
            background: #e3f2fd;
            border: 2px solid #90caf9;
            border-radius: 10px;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
            padding: 18px 24px 18px 24px;
            min-width: 120px;
            z-index: 100;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .stadium-area.p2 {
            left: auto;
            right: 270px;
        }

        .stadium-title {
            font-weight: bold;
            margin-bottom: 8px;
        }

        .stadium-card {
            font-size: 15px;
            color: #6a1b9a;
            margin-bottom: 8px;
        }

        .stadium-btn {
            /* background: #1976d2; */
            /* color: #fff; */
            /* border: none; */
            border: 1px solid black;
            border-radius: 6px;
            padding: 6px 14px;
            font-size: 14px;
            cursor: pointer;
            margin-top: 4px;
        }

        .stadium-btn:hover {
            background: #1565c0;
            color: #fff;
        }

        .banish-area {
            position: fixed;
            left: 270px;
            bottom: 190px;
            background: #e3f2fd;
            border: 2px solid #90caf9;
            border-radius: 10px;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
            padding: 18px 24px 18px 24px;
            min-width: 120px;
            z-index: 100;
        }

        .banish-area.p2 {
            left: auto;
            right: 270px;
        }

        .banish-title {
            font-weight: bold;
            margin-bottom: 8px;
        }

        .banish-btn {
            width: 100%;
            padding: 8px;
            font-size: 15px;
            /* background: #ff9800;
            color: #fff;
            border: none; */
            border: 1px solid black;
            border-radius: 6px;
            cursor: pointer;
            margin-top: 10px;
            transition: background 0.2s;
        }

        .banish-btn:hover {
            background: #1565c0;
            color: #fff;
        }

        .coin-area {
            position: fixed;
            top: 14px;
            left: 24px;
            background: #e3f2fd;
            border: 2px solid #90caf9;
            border-radius: 10px;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
            padding: 16px 16px 16px 16px;
            min-width: 120px;
            z-index: 2000;
            display: flex;
            flex-direction: column;
            align-items: center;
        }

        .coin-btn {
            background: #1976d2;
            color: #fff;
            border: none;
            border-radius: 6px;
            padding: 8px 18px;
            font-size: 16px;
            cursor: pointer;
            transition: background 0.2s;
        }

        .coin-btn:hover {
            background: #1565c0;
            color: #fff;
        }

        .coin-result {
            font-size: 18px;
            font-weight: bold;
            color: #d84315;
            margin-top: 4px;
        }
    </style>
</head>

<body>
    <div class="main-flex">
        <!-- 对战区 玩家1 -->
        <div class="battle-area" id="battleArea1">
            <div class="battle-left">
                <div class="battle-slot" onclick="openBattleModal(1, 'left', 0)"><span
                        class="battle-label">1</span><span id="battleLeft1_0" class="battle-card battle-empty">空</span>
                </div>
                <div class="battle-slot" onclick="openBattleModal(1, 'left', 1)"><span
                        class="battle-label">2</span><span id="battleLeft1_1" class="battle-card battle-empty">空</span>
                </div>
                <div class="battle-slot" onclick="openBattleModal(1, 'left', 2)"><span
                        class="battle-label">3</span><span id="battleLeft1_2" class="battle-card battle-empty">空</span>
                </div>
                <div class="battle-slot" onclick="openBattleModal(1, 'left', 3)"><span
                        class="battle-label">4</span><span id="battleLeft1_3" class="battle-card battle-empty">空</span>
                </div>
                <div class="battle-slot" onclick="openBattleModal(1, 'left', 4)"><span
                        class="battle-label">5</span><span id="battleLeft1_4" class="battle-card battle-empty">空</span>
                </div>
            </div>
            <div class="battle-right">
                <div class="battle-slot" onclick="openBattleModal(1, 'right', 0)"><span
                        class="battle-label">斗</span><span id="battleRight1_0" class="battle-card battle-empty">空</span>
                </div>
            </div>
        </div>
        <!-- 玩家1 -->
        <div class="player-container player1">
            <h2>P1</h2>
            <input type="text" id="cardInput1" placeholder="如：1喷火龙、2基本火能">
            <button class="btn" onclick="addCards(1)">设置卡组</button>
            <div class="deck-area" id="deckArea1">
                <div class="deck-btns">
                    <button class="btn" onclick="restart(1)">重开</button>
                    <button class="btn" onclick="placeRewardCards(1)">放置奖励牌</button>
                    <button class="btn" onclick="shuffleDeck(1)">洗牌</button>
                    <button class="btn" onclick="showDeckModal(1)">看牌</button>
                    <button class="btn" onclick="drawCards(1)">抽牌</button>
                </div>
                <div class="deck-list" id="deckList1">
                    <strong>牌库：</strong> <span id="deckCount1"></span>
                </div>
            </div>
            <div class="deck-list" id="handList1" style="margin-top:16px; display:none;">
                <strong>手牌：</strong>
                <ul id="handUl1"></ul>
            </div>
        </div>
        <!-- 玩家2 -->
        <div class="player-container player2">
            <h2>P2</h2>
            <input type="text" id="cardInput2" placeholder="如：1喷火龙、2基本火能">
            <button class="btn" onclick="addCards(2)">设置卡组</button>
            <div class="deck-area" id="deckArea2">
                <div class="deck-btns">
                    <button class="btn" onclick="restart(2)">重开</button>
                    <button class="btn" onclick="placeRewardCards(2)">放置奖励牌</button>
                    <button class="btn" onclick="shuffleDeck(2)">洗牌</button>
                    <button class="btn" onclick="showDeckModal(2)">看牌</button>
                    <button class="btn" onclick="drawCards(2)">抽牌</button>
                </div>
                <div class="deck-list" id="deckList2">
                    <strong>牌库：</strong> <span id="deckCount2"></span>
                </div>
            </div>
            <div class="deck-list" id="handList2" style="margin-top:16px; display:none;">
                <strong>手牌：</strong>
                <ul id="handUl2"></ul>
            </div>
        </div>

        <!-- 对战区 玩家2 -->
        <div class="battle-area" id="battleArea2">
            <div class="battle-right">
                <div class="battle-slot" onclick="openBattleModal(2, 'right', 0)"><span
                        class="battle-label">斗</span><span id="battleRight2_0" class="battle-card battle-empty">空</span>
                </div>
            </div>
            <div class="battle-left">
                <div class="battle-slot" onclick="openBattleModal(2, 'left', 0)"><span
                        class="battle-label">1</span><span id="battleLeft2_0" class="battle-card battle-empty">空</span>
                </div>
                <div class="battle-slot" onclick="openBattleModal(2, 'left', 1)"><span
                        class="battle-label">2</span><span id="battleLeft2_1" class="battle-card battle-empty">空</span>
                </div>
                <div class="battle-slot" onclick="openBattleModal(2, 'left', 2)"><span
                        class="battle-label">3</span><span id="battleLeft2_2" class="battle-card battle-empty">空</span>
                </div>
                <div class="battle-slot" onclick="openBattleModal(2, 'left', 3)"><span
                        class="battle-label">4</span><span id="battleLeft2_3" class="battle-card battle-empty">空</span>
                </div>
                <div class="battle-slot" onclick="openBattleModal(2, 'left', 4)"><span
                        class="battle-label">5</span><span id="battleLeft2_4" class="battle-card battle-empty">空</span>
                </div>
            </div>
        </div>
    </div>
    <!-- 看牌弹窗 玩家1-->
    <div class="modal" id="deckModal1">
        <div class="modal-content">
            <button class="close-btn" onclick="closeDeckModal(1)">关闭</button>
            <h3>选择要加入手牌的牌</h3>
            <ul id="modalDeckUl1"></ul>
        </div>
    </div>
    <!-- 看牌弹窗 玩家2-->
    <div class="modal" id="deckModal2">
        <div class="modal-content">
            <button class="close-btn" onclick="closeDeckModal(2)">关闭</button>
            <h3>选择要加入手牌的牌</h3>
            <ul id="modalDeckUl2"></ul>
        </div>
    </div>
    <!-- 奖赏区 玩家1-->
    <div class="reward-area" id="rewardArea1">
        <div class="reward-title">奖赏区</div>
        <div id="rewardCount1">剩余 0 张</div>
        <button class="reward-btn" onclick="shuffleReward(1)">洗牌</button>
        <button class="reward-btn" onclick="showRewardModal(1)">看牌</button>
        <button class="reward-btn" onclick="drawReward(1)">拿奖</button>
    </div>
    <!-- 奖赏区 玩家2-->
    <div class="reward-area p2" id="rewardArea2">
        <div class="reward-title">奖赏区</div>
        <div id="rewardCount2">剩余 0 张</div>
        <button class="reward-btn" onclick="shuffleReward(2)">洗牌</button>
        <button class="reward-btn" onclick="showRewardModal(2)">看牌</button>
        <button class="reward-btn" onclick="drawReward(2)">拿奖</button>
    </div>
    <!-- 弃牌区 玩家1-->
    <div class="discard-area" id="discardArea1">
        <div class="discard-title">弃牌区</div>
        <div id="discardCount1">剩余 0 张</div>
        <button class="discard-btn" onclick="showDiscardModal(1)">看牌</button>
    </div>
    <!-- 弃牌区 玩家2-->
    <div class="discard-area p2" id="discardArea2">
        <div class="discard-title">弃牌区</div>
        <div id="discardCount2">剩余 0 张</div>
        <button class="discard-btn" onclick="showDiscardModal(2)">看牌</button>
    </div>
    <!-- 弃牌弹窗 玩家1-->
    <div class="modal" id="discardModal1">
        <div class="modal-content">
            <button class="close-btn" onclick="closeDiscardModal(1)">关闭</button>
            <h3>选择要加入手牌的牌</h3>
            <ul id="modalDiscardUl1"></ul>
        </div>
    </div>
    <!-- 弃牌弹窗 玩家2-->
    <div class="modal" id="discardModal2">
        <div class="modal-content">
            <button class="close-btn" onclick="closeDiscardModal(2)">关闭</button>
            <h3>选择要加入手牌的牌</h3>
            <ul id="modalDiscardUl2"></ul>
        </div>
    </div>
    <!-- 对战区手牌选择弹窗 玩家1 -->
    <div class="modal" id="battleModal1" style="display:none;">
        <div class="modal-content">
            <button class="close-btn" onclick="closeBattleModal(1)">关闭</button>
            <h3>选择要放置的手牌</h3>
            <ul id="battleModalList1" class="battle-modal-list"></ul>
        </div>
    </div>
    <!-- 对战区手牌选择弹窗 玩家2 -->
    <div class="modal" id="battleModal2" style="display:none;">
        <div class="modal-content">
            <button class="close-btn" onclick="closeBattleModal(2)">关闭</button>
            <h3>选择要放置的手牌</h3>
            <ul id="battleModalList2" class="battle-modal-list"></ul>
        </div>
    </div>
    <!-- 场地区 玩家1 -->
    <div class="stadium-area" id="stadiumArea1">
        <div class="stadium-title">场地区</div>
        <div id="stadiumCard1" class="stadium-card">空</div>
        <button class="stadium-btn" onclick="openStadiumModal(1)">操作</button>
    </div>
    <!-- 场地区 玩家2 -->
    <div class="stadium-area p2" id="stadiumArea2">
        <div class="stadium-title">场地区</div>
        <div id="stadiumCard2" class="stadium-card">空</div>
        <button class="stadium-btn" onclick="openStadiumModal(2)">操作</button>
    </div>
    <!-- 场地区弹窗 玩家1 -->
    <div class="modal" id="stadiumModal1">
        <div class="modal-content">
            <button class="close-btn" onclick="closeStadiumModal(1)">关闭</button>
            <h3>场地区操作</h3>
            <div id="stadiumModalContent1"></div>
        </div>
    </div>
    <!-- 场地区弹窗 玩家2 -->
    <div class="modal" id="stadiumModal2">
        <div class="modal-content">
            <button class="close-btn" onclick="closeStadiumModal(2)">关闭</button>
            <h3>场地区操作</h3>
            <div id="stadiumModalContent2"></div>
        </div>
    </div>
    <!-- 奖赏区看牌弹窗 玩家1-->
    <div class="modal" id="rewardModal1">
        <div class="modal-content">
            <button class="close-btn" onclick="closeRewardModal(1)">关闭</button>
            <h3>选择要加入手牌的奖赏牌</h3>
            <ul id="modalRewardUl1"></ul>
        </div>
    </div>
    <!-- 奖赏区看牌弹窗 玩家2-->
    <div class="modal" id="rewardModal2">
        <div class="modal-content">
            <button class="close-btn" onclick="closeRewardModal(2)">关闭</button>
            <h3>选择要加入手牌的奖赏牌</h3>
            <ul id="modalRewardUl2"></ul>
        </div>
    </div>
    <!-- 放逐区 玩家1-->
    <div class="banish-area" id="banishArea1">
        <div class="banish-title">放逐区</div>
        <div id="banishCount1">剩余 0 张</div>
        <button class="banish-btn" onclick="showBanishModal(1)">看牌</button>
    </div>
    <!-- 放逐区 玩家2-->
    <div class="banish-area p2" id="banishArea2">
        <div class="banish-title">放逐区</div>
        <div id="banishCount2">剩余 0 张</div>
        <button class="banish-btn" onclick="showBanishModal(2)">看牌</button>
    </div>
    <!-- 放逐区看牌弹窗 玩家1-->
    <div class="modal" id="banishModal1">
        <div class="modal-content">
            <button class="close-btn" onclick="closeBanishModal(1)">关闭</button>
            <h3>选择要加入手牌的放逐牌</h3>
            <ul id="modalBanishUl1"></ul>
        </div>
    </div>
    <!-- 放逐区看牌弹窗 玩家2-->
    <div class="modal" id="banishModal2">
        <div class="modal-content">
            <button class="close-btn" onclick="closeBanishModal(2)">关闭</button>
            <h3>选择要加入手牌的放逐牌</h3>
            <ul id="modalBanishUl2"></ul>
        </div>
    </div>
    <!-- 抛硬币区 -->
    <div class="coin-area">
        <button class="coin-btn" onclick="flipCoin()">抛硬币</button>
        <div id="coinResult" class="coin-result"></div>
    </div>
    <script>
        // 玩家1
        let deck1 = [];
        let hand1 = [];
        let isShuffled1 = false;
        let reward1 = [];
        let discard1 = [];
        let battleLeft1 = [[], [], [], [], []];
        let battleRight1 = [[]];
        let battleLeftDamage1 = [0, 0, 0, 0, 0];
        let battleRightDamage1 = [0];
        let stadium1 = null;
        // 玩家2
        let deck2 = [];
        let hand2 = [];
        let isShuffled2 = false;
        let reward2 = [];
        let discard2 = [];
        let battleLeft2 = [[], [], [], [], []];
        let battleRight2 = [[]];
        let battleLeftDamage2 = [0, 0, 0, 0, 0];
        let battleRightDamage2 = [0];
        let stadium2 = null;
        // 放逐区变量
        let banish1 = [];
        let banish2 = [];

        function addCards(player) {
            const input = document.getElementById('cardInput' + player).value.trim();
            if (!input) return;
            const parts = input.split(/[，、,]/);
            for (let part of parts) {
                part = part.trim();
                if (!part) continue;
                const match = part.match(/^(\d+)\s*(.+)$/);
                if (match) {
                    const count = parseInt(match[1], 10);
                    const name = match[2].trim();
                    for (let i = 0; i < count; i++) {
                        if (player === 1) deck1.push(name);
                        else deck2.push(name);
                    }
                }
            }
            if (player === 1) {
                isShuffled1 = false;
                renderDeck(1);
            } else {
                isShuffled2 = false;
                renderDeck(2);
            }
            document.getElementById('deckArea' + player).style.display = '';
        }

        function shuffleDeck(player) {
            let deck = player === 1 ? deck1 : deck2;
            for (let i = deck.length - 1; i > 0; i--) {
                const j = Math.floor(Math.random() * (i + 1));
                [deck[i], deck[j]] = [deck[j], deck[i]];
            }
            if (player === 1) {
                isShuffled1 = true;
                renderDeck(1);
            } else {
                isShuffled2 = true;
                renderDeck(2);
            }
            document.getElementById('deckArea' + player).style.display = '';
        }

        function drawCards(player) {
            let deck = player === 1 ? deck1 : deck2;
            let hand = player === 1 ? hand1 : hand2;
            if (deck.length === 0) {
                alert('牌库已空，无法抽牌！');
                return;
            }
            let num = prompt('请输入要抽的牌数：', '1');
            if (num === null) return;
            num = parseInt(num, 10);
            if (isNaN(num) || num <= 0) {
                alert('请输入有效的数字！');
                return;
            }
            if (num > deck.length) {
                alert('牌库剩余不足，最多可抽 ' + deck.length + ' 张牌。');
                return;
            }
            const drawn = deck.splice(0, num);
            hand.push(...drawn);
            if (player === 1) {
                isShuffled1 = false;
                hand1 = hand;
                renderDeck(1);
                renderHand(1);
            } else {
                isShuffled2 = false;
                hand2 = hand;
                renderDeck(2);
                renderHand(2);
            }
        }

        function renderDeck(player) {
            let deck = player === 1 ? deck1 : deck2;
            let isShuffled = player === 1 ? isShuffled1 : isShuffled2;
            const deckArea = document.getElementById('deckArea' + player);
            deckArea.style.display = deck.length > 0 ? '' : 'none';
            document.getElementById('deckCount' + player).textContent = `剩余 ${deck.length} 张`;
        }

        function renderHand(player) {
            let hand = player === 1 ? hand1 : hand2;
            let banish = player === 1 ? banish1 : banish2;
            const handDiv = document.getElementById('handList' + player);
            const ul = document.getElementById('handUl' + player);
            ul.innerHTML = '';
            if (hand.length === 0) {
                handDiv.style.display = 'none';
            } else {
                handDiv.style.display = '';
                hand.forEach((card, idx) => {
                    const li = document.createElement('li');
                    li.textContent = card;
                    // 弃牌按钮
                    const btn = document.createElement('button');
                    btn.textContent = '弃牌';
                    btn.className = 'choose-btn';
                    btn.style.marginLeft = '10px';
                    btn.onclick = function () {
                        discardCard(player, idx);
                    };
                    li.appendChild(btn);
                    // 放逐按钮
                    const banishBtn = document.createElement('button');
                    banishBtn.textContent = '放逐';
                    banishBtn.className = 'choose-btn';
                    banishBtn.style.marginLeft = '8px';
                    banishBtn.onclick = function () {
                        // 移入放逐区
                        banish.push(card);
                        hand.splice(idx, 1);
                        if (player === 1) {
                            hand1 = hand;
                            banish1 = banish;
                            renderHand(1);
                            renderBanish(1);
                        } else {
                            hand2 = hand;
                            banish2 = banish;
                            renderHand(2);
                            renderBanish(2);
                        }
                    };
                    li.appendChild(banishBtn);
                    ul.appendChild(li);
                });
            }
        }

        // 弃牌逻辑
        function discardCard(player, idx) {
            let hand = player === 1 ? hand1 : hand2;
            let discard = player === 1 ? discard1 : discard2;
            const card = hand.splice(idx, 1)[0];
            discard.push(card);
            if (player === 1) {
                hand1 = hand;
                discard1 = discard;
                renderHand(1);
                renderDiscard(1);
            } else {
                hand2 = hand;
                discard2 = discard;
                renderHand(2);
                renderDiscard(2);
            }
        }

        // 渲染弃牌区
        function renderDiscard(player) {
            let discard = player === 1 ? discard1 : discard2;
            const area = document.getElementById('discardArea' + player);
            const countDiv = document.getElementById('discardCount' + player);
            if (discard.length > 0) {
                area.style.display = '';
                countDiv.textContent = `剩余 ${discard.length} 张`;
            } else {
                // area.style.display = 'none';
            }
        }

        // 弃牌区看牌弹窗
        function showDiscardModal(player) {
            let discard = player === 1 ? discard1 : discard2;
            let hand = player === 1 ? hand1 : hand2;
            let deck = player === 1 ? deck1 : deck2;
            let reward = player === 1 ? reward1 : reward2;
            const modal = document.getElementById('discardModal' + player);
            const ul = document.getElementById('modalDiscardUl' + player);
            ul.innerHTML = '';
            discard.forEach((card, idx) => {
                const li = document.createElement('li');
                li.textContent = card;
                const btn = document.createElement('button');
                btn.textContent = '加入手牌';
                btn.className = 'choose-btn';
                btn.onclick = function () {
                    hand.push(card);
                    discard.splice(idx, 1);
                    if (player === 1) {
                        hand1 = hand;
                        discard1 = discard;
                        renderHand(1);
                        renderDiscard(1);
                        showDiscardModal(1);
                    } else {
                        hand2 = hand;
                        discard2 = discard;
                        renderHand(2);
                        renderDiscard(2);
                        showDiscardModal(2);
                    }
                };
                li.appendChild(btn);
                // 放回牌底按钮
                const backBtn = document.createElement('button');
                backBtn.textContent = '放回牌底';
                backBtn.className = 'choose-btn';
                backBtn.style.marginLeft = '8px';
                backBtn.onclick = function () {
                    deck.push(card);
                    discard.splice(idx, 1);
                    if (player === 1) {
                        deck1 = deck;
                        discard1 = discard;
                        renderDeck(1);
                        renderDiscard(1);
                        showDiscardModal(1);
                    } else {
                        deck2 = deck;
                        discard2 = discard;
                        renderDeck(2);
                        renderDiscard(2);
                        showDiscardModal(2);
                    }
                };
                li.appendChild(backBtn);
                // 入奖按钮
                const rewardBtn = document.createElement('button');
                rewardBtn.textContent = '入奖';
                rewardBtn.className = 'choose-btn';
                rewardBtn.style.marginLeft = '8px';
                rewardBtn.onclick = function () {
                    reward.push(card);
                    discard.splice(idx, 1);
                    if (player === 1) {
                        reward1 = reward;
                        discard1 = discard;
                        renderReward(1);
                        renderDiscard(1);
                        showDiscardModal(1);
                    } else {
                        reward2 = reward;
                        discard2 = discard;
                        renderReward(2);
                        renderDiscard(2);
                        showDiscardModal(2);
                    }
                };
                li.appendChild(rewardBtn);
                ul.appendChild(li);
            });
            modal.style.display = 'flex';
        }

        function closeDiscardModal(player) {
            document.getElementById('discardModal' + player).style.display = 'none';
        }

        // 看牌弹窗相关
        function showDeckModal(player) {
            let deck = player === 1 ? deck1 : deck2;
            let hand = player === 1 ? hand1 : hand2;
            const modal = document.getElementById('deckModal' + player);
            const ul = document.getElementById('modalDeckUl' + player);
            ul.innerHTML = '';
            deck.forEach((card, idx) => {
                const li = document.createElement('li');
                li.textContent = card;
                const btn = document.createElement('button');
                btn.textContent = '加入手牌';
                btn.className = 'choose-btn';
                btn.onclick = function () {
                    hand.push(card);
                    deck.splice(idx, 1);
                    if (player === 1) {
                        hand1 = hand;
                        deck1 = deck;
                        renderDeck(1);
                        renderHand(1);
                        showDeckModal(1);
                    } else {
                        hand2 = hand;
                        deck2 = deck;
                        renderDeck(2);
                        renderHand(2);
                        showDeckModal(2);
                    }
                };
                li.appendChild(btn);
                ul.appendChild(li);
            });
            modal.style.display = 'flex';
        }

        function closeDeckModal(player) {
            document.getElementById('deckModal' + player).style.display = 'none';
        }

        // 放置奖励牌
        function placeRewardCards(player) {
            let deck = player === 1 ? deck1 : deck2;
            let reward = player === 1 ? reward1 : reward2;
            if (reward.length > 0) {
                alert(`P${player} 请勿重复放置奖励牌！`);
                return;
            }
            if (deck.length < 6) {
                alert('牌库不足6张，无法放置奖励牌！');
                return;
            }
            reward = deck.splice(0, 6);
            if (player === 1) {
                deck1 = deck;
                reward1 = reward;
                renderDeck(1);
                renderReward(1);
            } else {
                deck2 = deck;
                reward2 = reward;
                renderDeck(2);
                renderReward(2);
            }
        }

        // 渲染奖赏区
        function renderReward(player) {
            let reward = player === 1 ? reward1 : reward2;
            const area = document.getElementById('rewardArea' + player);
            const countDiv = document.getElementById('rewardCount' + player);
            if (reward.length > 0) {
                area.style.display = '';
                countDiv.textContent = `剩余 ${reward.length} 张`;
            } else {
                // area.style.display = 'none';
            }
        }

        // 拿奖
        function drawReward(player) {
            let reward = player === 1 ? reward1 : reward2;
            let hand = player === 1 ? hand1 : hand2;
            if (reward.length === 0) {
                alert('奖赏区已空！');
                return;
            }
            let num = prompt('请输入要拿的奖赏牌数量：', '1');
            if (num === null) return;
            num = parseInt(num, 10);
            if (isNaN(num) || num <= 0) {
                alert('请输入有效的数字！');
                return;
            }
            if (num > reward.length) {
                alert('奖赏区剩余不足，最多可拿 ' + reward.length + ' 张。');
                return;
            }
            // 随机抽取num张
            for (let i = 0; i < num; i++) {
                const idx = Math.floor(Math.random() * reward.length);
                const card = reward.splice(idx, 1)[0];
                hand.push(card);
            }
            if (player === 1) {
                reward1 = reward;
                hand1 = hand;
                renderReward(1);
                renderHand(1);
            } else {
                reward2 = reward;
                hand2 = hand;
                renderReward(2);
                renderHand(2);
            }
        }

        // 渲染对战区
        function renderBattle(player) {
            let battleLeft = player === 1 ? battleLeft1 : battleLeft2;
            let battleRight = player === 1 ? battleRight1 : battleRight2;
            let battleLeftDamage = player === 1 ? battleLeftDamage1 : battleLeftDamage2;
            let battleRightDamage = player === 1 ? battleRightDamage1 : battleRightDamage2;
            for (let i = 0; i < 5; i++) {
                const el = document.getElementById(`battleLeft${player}_${i}`);
                el.innerHTML = '';
                // 拖拽功能
                el.setAttribute('draggable', 'true');
                el.ondragstart = function(e) {
                    e.dataTransfer.setData('text/plain', JSON.stringify({player, side: 'left', idx: i}));
                };
                el.ondragover = function(e) { e.preventDefault(); };
                el.ondrop = function(e) {
                    e.preventDefault();
                    const from = JSON.parse(e.dataTransfer.getData('text/plain'));
                    const to = {player, side: 'left', idx: i};
                    swapBattleSlots(from, to);
                };
                // 伤害显示和按钮
                const dmgDiv = document.createElement('div');
                dmgDiv.className = 'battle-damage';
                if (battleLeftDamage[i] > 0) {
                    dmgDiv.textContent = `伤害：${battleLeftDamage[i]}`;
                }
                el.appendChild(dmgDiv);
                const dmgBtn = document.createElement('button');
                dmgBtn.textContent = '设置伤害';
                dmgBtn.className = 'battle-damage-btn';
                dmgBtn.onclick = function (e) {
                    e.stopPropagation();
                    setBattleDamage(player, 'left', i);
                };
                el.appendChild(dmgBtn);
                if (battleLeft[i] && battleLeft[i].length > 0) {
                    el.classList.remove('battle-empty');
                    const inner = document.createElement('div');
                    inner.className = 'battle-slot-inner';
                    battleLeft[i].forEach((card, cidx) => {
                        const cardDiv = document.createElement('div');
                        cardDiv.className = 'battle-card';
                        // 卡牌名
                        const nameSpan = document.createElement('span');
                        nameSpan.textContent = card;
                        cardDiv.appendChild(nameSpan);
                        // 上移按钮
                        const upBtn = document.createElement('button');
                        upBtn.textContent = '↑';
                        upBtn.className = 'battle-card-btn';
                        upBtn.disabled = cidx === 0;
                        upBtn.onclick = function (e) {
                            e.stopPropagation();
                            moveBattleCard(player, 'left', i, cidx, -1);
                        };
                        cardDiv.appendChild(upBtn);
                        // 下移按钮
                        const downBtn = document.createElement('button');
                        downBtn.textContent = '↓';
                        downBtn.className = 'battle-card-btn';
                        downBtn.disabled = cidx === battleLeft[i].length - 1;
                        downBtn.onclick = function (e) {
                            e.stopPropagation();
                            moveBattleCard(player, 'left', i, cidx, 1);
                        };
                        cardDiv.appendChild(downBtn);
                        // 移除按钮
                        const removeBtn = document.createElement('button');
                        removeBtn.textContent = '移除';
                        removeBtn.className = 'battle-card-btn';
                        removeBtn.onclick = function (e) {
                            e.stopPropagation();
                            removeBattleCard(player, 'left', i, cidx);
                        };
                        cardDiv.appendChild(removeBtn);
                        inner.appendChild(cardDiv);
                    });
                    el.appendChild(inner);
                } else {
                    el.classList.add('battle-empty');
                    el.textContent = '空';
                }
            }
            const elR = document.getElementById(`battleRight${player}_0`);
            elR.innerHTML = '';
            // 拖拽功能
            elR.setAttribute('draggable', 'true');
            elR.ondragstart = function(e) {
                e.dataTransfer.setData('text/plain', JSON.stringify({player, side: 'right', idx: 0}));
            };
            elR.ondragover = function(e) { e.preventDefault(); };
            elR.ondrop = function(e) {
                e.preventDefault();
                const from = JSON.parse(e.dataTransfer.getData('text/plain'));
                const to = {player, side: 'right', idx: 0};
                swapBattleSlots(from, to);
            };
            // 伤害显示和按钮
            const dmgDivR = document.createElement('div');
            dmgDivR.className = 'battle-damage';
            if (battleRightDamage[0] > 0) {
                dmgDivR.textContent = `伤害：${battleRightDamage[0]}`;
            }
            elR.appendChild(dmgDivR);
            const dmgBtnR = document.createElement('button');
            dmgBtnR.textContent = '设置伤害';
            dmgBtnR.className = 'battle-damage-btn';
            dmgBtnR.onclick = function (e) {
                e.stopPropagation();
                setBattleDamage(player, 'right', 0);
            };
            elR.appendChild(dmgBtnR);
            if (battleRight[0] && battleRight[0].length > 0) {
                elR.classList.remove('battle-empty');
                const inner = document.createElement('div');
                inner.className = 'battle-slot-inner';
                battleRight[0].forEach((card, cidx) => {
                    const cardDiv = document.createElement('div');
                    cardDiv.className = 'battle-card';
                    // 卡牌名
                    const nameSpan = document.createElement('span');
                    nameSpan.textContent = card;
                    cardDiv.appendChild(nameSpan);
                    // 上移按钮
                    const upBtn = document.createElement('button');
                    upBtn.textContent = '↑';
                    upBtn.className = 'battle-card-btn';
                    upBtn.disabled = cidx === 0;
                    upBtn.onclick = function (e) {
                        e.stopPropagation();
                        moveBattleCard(player, 'right', 0, cidx, -1);
                    };
                    cardDiv.appendChild(upBtn);
                    // 下移按钮
                    const downBtn = document.createElement('button');
                    downBtn.textContent = '↓';
                    downBtn.className = 'battle-card-btn';
                    downBtn.disabled = cidx === battleRight[0].length - 1;
                    downBtn.onclick = function (e) {
                        e.stopPropagation();
                        moveBattleCard(player, 'right', 0, cidx, 1);
                    };
                    cardDiv.appendChild(downBtn);
                    // 移除按钮
                    const removeBtn = document.createElement('button');
                    removeBtn.textContent = '移除';
                    removeBtn.className = 'battle-card-btn';
                    removeBtn.onclick = function (e) {
                        e.stopPropagation();
                        removeBattleCard(player, 'right', 0, cidx);
                    };
                    cardDiv.appendChild(removeBtn);
                    inner.appendChild(cardDiv);
                });
                elR.appendChild(inner);
            } else {
                elR.classList.add('battle-empty');
                elR.textContent = '空';
            }
        }

        // 打开对战区手牌选择弹窗
        let currentBattle = { player: 1, side: 'left', idx: 0 };
        function openBattleModal(player, side, idx) {
            currentBattle = { player, side, idx };
            let hand = player === 1 ? hand1 : hand2;
            const modal = document.getElementById('battleModal' + player);
            const ul = document.getElementById('battleModalList' + player);
            ul.innerHTML = '';
            if (hand.length === 0) {
                const li = document.createElement('li');
                li.textContent = '手牌为空';
                ul.appendChild(li);
            } else {
                hand.forEach((card, hidx) => {
                    const li = document.createElement('li');
                    li.textContent = card;
                    const btn = document.createElement('button');
                    btn.textContent = '放置';
                    btn.className = 'battle-modal-btn';
                    btn.onclick = function () {
                        placeBattleCard(player, side, idx, hidx);
                        closeBattleModal(player);
                    };
                    li.appendChild(btn);
                    ul.appendChild(li);
                });
            }
            modal.style.display = 'flex';
        }

        function closeBattleModal(player) {
            document.getElementById('battleModal' + player).style.display = 'none';
        }

        // 放置卡牌到对战区
        function placeBattleCard(player, side, idx, handIdx) {
            let hand = player === 1 ? hand1 : hand2;
            let battleLeft = player === 1 ? battleLeft1 : battleLeft2;
            let battleRight = player === 1 ? battleRight1 : battleRight2;
            let card = hand.splice(handIdx, 1)[0];
            if (side === 'left') {
                battleLeft[idx].push(card);
            } else {
                battleRight[0].push(card);
            }
            if (player === 1) {
                hand1 = hand;
                battleLeft1 = battleLeft;
                battleRight1 = battleRight;
                renderHand(1);
                renderBattle(1);
            } else {
                hand2 = hand;
                battleLeft2 = battleLeft;
                battleRight2 = battleRight;
                renderHand(2);
                renderBattle(2);
            }
        }

        // 重开：手牌放回牌库并洗牌
        function restart(player) {
            let deck = player === 1 ? deck1 : deck2;
            let hand = player === 1 ? hand1 : hand2;
            // 手牌放回牌库
            deck = deck.concat(hand);
            hand = [];
            // 洗牌
            for (let i = deck.length - 1; i > 0; i--) {
                const j = Math.floor(Math.random() * (i + 1));
                [deck[i], deck[j]] = [deck[j], deck[i]];
            }
            if (player === 1) {
                deck1 = deck;
                hand1 = hand;
                isShuffled1 = true;
                renderDeck(1);
                renderHand(1);
            } else {
                deck2 = deck;
                hand2 = hand;
                isShuffled2 = true;
                renderDeck(2);
                renderHand(2);
            }
        }

        // 移除对战区卡牌
        function removeBattleCard(player, side, idx, cidx) {
            let hand = player === 1 ? hand1 : hand2;
            let battleLeft = player === 1 ? battleLeft1 : battleLeft2;
            let battleRight = player === 1 ? battleRight1 : battleRight2;
            let card;
            if (side === 'left') {
                card = battleLeft[idx].splice(cidx, 1)[0];
            } else {
                card = battleRight[0].splice(cidx, 1)[0];
            }
            hand.push(card);
            if (player === 1) {
                hand1 = hand;
                battleLeft1 = battleLeft;
                battleRight1 = battleRight;
                renderHand(1);
                renderBattle(1);
            } else {
                hand2 = hand;
                battleLeft2 = battleLeft;
                battleRight2 = battleRight;
                renderHand(2);
                renderBattle(2);
            }
        }

        // 对战区卡牌顺序调整
        function moveBattleCard(player, side, idx, cidx, direction) {
            let battleLeft = player === 1 ? battleLeft1 : battleLeft2;
            let battleRight = player === 1 ? battleRight1 : battleRight2;
            if (side === 'left') {
                const arr = battleLeft[idx];
                if (cidx + direction < 0 || cidx + direction >= arr.length) return;
                [arr[cidx], arr[cidx + direction]] = [arr[cidx + direction], arr[cidx]];
            } else {
                const arr = battleRight[0];
                if (cidx + direction < 0 || cidx + direction >= arr.length) return;
                [arr[cidx], arr[cidx + direction]] = [arr[cidx + direction], arr[cidx]];
            }
            if (player === 1) {
                battleLeft1 = battleLeft;
                battleRight1 = battleRight;
                renderBattle(1);
            } else {
                battleLeft2 = battleLeft;
                battleRight2 = battleRight;
                renderBattle(2);
            }
        }

        // 设置伤害
        function setBattleDamage(player, side, idx) {
            let val = prompt('请输入伤害值（数字，0为无伤害）：', '0');
            if (val === null) return;
            val = parseInt(val, 10);
            if (isNaN(val) || val < 0) {
                alert('请输入有效的非负数字！');
                return;
            }
            if (side === 'left') {
                if (player === 1) {
                    battleLeftDamage1[idx] = val;
                    renderBattle(1);
                } else {
                    battleLeftDamage2[idx] = val;
                    renderBattle(2);
                }
            } else {
                if (player === 1) {
                    battleRightDamage1[0] = val;
                    renderBattle(1);
                } else {
                    battleRightDamage2[0] = val;
                    renderBattle(2);
                }
            }
        }

        // 渲染场地区
        function renderStadium(player) {
            const card = player === 1 ? stadium1 : stadium2;
            const cardDiv = document.getElementById('stadiumCard' + player);
            cardDiv.textContent = card ? card : '空';
        }

        // 打开场地区弹窗
        function openStadiumModal(player) {
            const modal = document.getElementById('stadiumModal' + player);
            const contentDiv = document.getElementById('stadiumModalContent' + player);
            const card = player === 1 ? stadium1 : stadium2;
            let hand = player === 1 ? hand1 : hand2;
            let discard = player === 1 ? discard1 : discard2;
            contentDiv.innerHTML = '';
            if (!card) {
                // 选择手牌放置
                if (hand.length === 0) {
                    contentDiv.innerHTML = '<div>手牌为空</div>';
                } else {
                    const ul = document.createElement('ul');
                    ul.style.listStyle = 'none';
                    ul.style.padding = '0';
                    hand.forEach((c, idx) => {
                        const li = document.createElement('li');
                        li.textContent = c;
                        const btn = document.createElement('button');
                        btn.textContent = '放置';
                        btn.className = 'choose-btn';
                        btn.onclick = function () {
                            if (player === 1) {
                                stadium1 = c;
                                hand1.splice(idx, 1);
                                renderStadium(1);
                                renderHand(1);
                            } else {
                                stadium2 = c;
                                hand2.splice(idx, 1);
                                renderStadium(2);
                                renderHand(2);
                            }
                            closeStadiumModal(player);
                        };
                        li.appendChild(btn);
                        ul.appendChild(li);
                    });
                    contentDiv.appendChild(ul);
                }
            } else {
                // 已有卡牌，可弃牌或替换
                const cardDiv = document.createElement('div');
                cardDiv.textContent = '当前：' + card;
                cardDiv.style.marginBottom = '10px';
                contentDiv.appendChild(cardDiv);
                // 弃牌按钮
                const discardBtn = document.createElement('button');
                discardBtn.textContent = '弃牌';
                discardBtn.className = 'choose-btn';
                discardBtn.onclick = function () {
                    if (player === 1) {
                        discard1.push(stadium1);
                        stadium1 = null;
                        renderStadium(1);
                        renderDiscard(1);
                    } else {
                        discard2.push(stadium2);
                        stadium2 = null;
                        renderStadium(2);
                        renderDiscard(2);
                    }
                    closeStadiumModal(player);
                };
                contentDiv.appendChild(discardBtn);
                // 替换为手牌
                if (hand.length > 0) {
                    const replaceDiv = document.createElement('div');
                    replaceDiv.style.marginTop = '12px';
                    replaceDiv.textContent = '用手牌替换：';
                    contentDiv.appendChild(replaceDiv);
                    const ul = document.createElement('ul');
                    ul.style.listStyle = 'none';
                    ul.style.padding = '0';
                    hand.forEach((c, idx) => {
                        const li = document.createElement('li');
                        li.textContent = c;
                        const btn = document.createElement('button');
                        btn.textContent = '替换';
                        btn.className = 'choose-btn';
                        btn.onclick = function () {
                            // 先把场地卡弃牌
                            if (player === 1) {
                                discard1.push(stadium1);
                                stadium1 = c;
                                hand1.splice(idx, 1);
                                renderStadium(1);
                                renderHand(1);
                                renderDiscard(1);
                            } else {
                                discard2.push(stadium2);
                                stadium2 = c;
                                hand2.splice(idx, 1);
                                renderStadium(2);
                                renderHand(2);
                                renderDiscard(2);
                            }
                            closeStadiumModal(player);
                        };
                        li.appendChild(btn);
                        ul.appendChild(li);
                    });
                    contentDiv.appendChild(ul);
                }
            }
            modal.style.display = 'flex';
        }

        function closeStadiumModal(player) {
            document.getElementById('stadiumModal' + player).style.display = 'none';
        }

        // 奖赏区洗牌
        function shuffleReward(player) {
            let reward = player === 1 ? reward1 : reward2;
            for (let i = reward.length - 1; i > 0; i--) {
                const j = Math.floor(Math.random() * (i + 1));
                [reward[i], reward[j]] = [reward[j], reward[i]];
            }
            if (player === 1) {
                reward1 = reward;
                renderReward(1);
            } else {
                reward2 = reward;
                renderReward(2);
            }
        }

        // 奖赏区看牌弹窗
        function showRewardModal(player) {
            let reward = player === 1 ? reward1 : reward2;
            let hand = player === 1 ? hand1 : hand2;
            const modal = document.getElementById('rewardModal' + player);
            const ul = document.getElementById('modalRewardUl' + player);
            ul.innerHTML = '';
            reward.forEach((card, idx) => {
                const li = document.createElement('li');
                li.textContent = card;
                const btn = document.createElement('button');
                btn.textContent = '加入手牌';
                btn.className = 'choose-btn';
                btn.onclick = function () {
                    hand.push(card);
                    reward.splice(idx, 1);
                    if (player === 1) {
                        hand1 = hand;
                        reward1 = reward;
                        renderHand(1);
                        renderReward(1);
                        showRewardModal(1);
                    } else {
                        hand2 = hand;
                        reward2 = reward;
                        renderHand(2);
                        renderReward(2);
                        showRewardModal(2);
                    }
                };
                li.appendChild(btn);
                ul.appendChild(li);
            });
            modal.style.display = 'flex';
        }

        function closeRewardModal(player) {
            document.getElementById('rewardModal' + player).style.display = 'none';
        }

        // 渲染放逐区
        function renderBanish(player) {
            let banish = player === 1 ? banish1 : banish2;
            const area = document.getElementById('banishArea' + player);
            const countDiv = document.getElementById('banishCount' + player);
            if (banish.length > 0) {
                area.style.display = '';
                countDiv.textContent = `剩余 ${banish.length} 张`;
            } else {
                // area.style.display = 'none';
                countDiv.textContent = `剩余 0 张`;
            }
        }

        // 放逐区看牌弹窗
        function showBanishModal(player) {
            let banish = player === 1 ? banish1 : banish2;
            let hand = player === 1 ? hand1 : hand2;
            const modal = document.getElementById('banishModal' + player);
            const ul = document.getElementById('modalBanishUl' + player);
            ul.innerHTML = '';
            banish.forEach((card, idx) => {
                const li = document.createElement('li');
                li.textContent = card;
                const btn = document.createElement('button');
                btn.textContent = '加入手牌';
                btn.className = 'choose-btn';
                btn.onclick = function () {
                    hand.push(card);
                    banish.splice(idx, 1);
                    if (player === 1) {
                        hand1 = hand;
                        banish1 = banish;
                        renderHand(1);
                        renderBanish(1);
                        showBanishModal(1);
                    } else {
                        hand2 = hand;
                        banish2 = banish;
                        renderHand(2);
                        renderBanish(2);
                        showBanishModal(2);
                    }
                };
                li.appendChild(btn);
                ul.appendChild(li);
            });
            modal.style.display = 'flex';
        }
        function closeBanishModal(player) {
            document.getElementById('banishModal' + player).style.display = 'none';
        }

        // 拖拽交换battle栏位
        function swapBattleSlots(from, to) {
            if (from.player !== to.player) return; // 只允许同一玩家内交换
            let battleLeft = from.player === 1 ? battleLeft1 : battleLeft2;
            let battleRight = from.player === 1 ? battleRight1 : battleRight2;
            let battleLeftDamage = from.player === 1 ? battleLeftDamage1 : battleLeftDamage2;
            let battleRightDamage = from.player === 1 ? battleRightDamage1 : battleRightDamage2;
            let fromArr, toArr, fromDmg, toDmg;
            if (from.side === 'left') {
                fromArr = battleLeft[from.idx];
                fromDmg = battleLeftDamage[from.idx];
            } else {
                fromArr = battleRight[0];
                fromDmg = battleRightDamage[0];
            }
            if (to.side === 'left') {
                toArr = battleLeft[to.idx];
                toDmg = battleLeftDamage[to.idx];
            } else {
                toArr = battleRight[0];
                toDmg = battleRightDamage[0];
            }
            // 交换
            const tempArr = fromArr.slice();
            const tempDmg = fromDmg;
            if (from.side === 'left') {
                battleLeft[from.idx] = toArr.slice();
                battleLeftDamage[from.idx] = toDmg;
            } else {
                battleRight[0] = toArr.slice();
                battleRightDamage[0] = toDmg;
            }
            if (to.side === 'left') {
                battleLeft[to.idx] = tempArr;
                battleLeftDamage[to.idx] = tempDmg;
            } else {
                battleRight[0] = tempArr;
                battleRightDamage[0] = tempDmg;
            }
            // 刷新
            renderBattle(from.player);
        }

        // 初始化
        window.onload = function () {
            renderDeck(1);
            renderHand(1);
            renderReward(1);
            renderDiscard(1);
            renderBattle(1);
            renderStadium(1);
            renderBanish(1);
            renderDeck(2);
            renderHand(2);
            renderReward(2);
            renderDiscard(2);
            renderBattle(2);
            renderStadium(2);
            renderBanish(2);
            document.getElementById('cardInput1').value = '1光辉喷火龙 HP160 、1特性火焰鸟 HP120、4炎帝 HP230、1普通火焰鸟 HP120、1霓虹鱼V HP170、1怒鹦哥EX HP160、1妖尾红狐 HP210、2牡丹、2派帕、2奇树、2博士的研究、3老大的指令、1奇巴纳、4熔岩瀑布、2vip、2健行鞋、1沉重球、3巢穴球、1朋友手册、1离洞绳、3高级球、1能量转移、1捕捉器、1森林板、1能量输送、1讲究腰带、3交替推车、1交换机、2勇气护符、8火能、2防守V能';
            document.getElementById('cardInput2').value = '1冰砌鹅 HP110、1美洛耶塔 HP90、4梦幻V HP180、3梦幻VMAX HP310、4盖诺赛克特V HP190、3裁判、2老大的指令、2小菊儿的璀璨、2放逐市、1通顶雪道、4机器鹕、4对战会员通行证、2放逐吸尘器、3巢穴球、1朋友手册、2离洞绳、4高级球、3森林封印石、4强力糖锭、1讲究腰带、1交替推车、1灾祸箱、4汇流能量、3双重涡轮能量';
        };

        // 抛硬币功能
        function flipCoin() {
            const result = Math.random() < 0.5 ? '正面' : '反面';
            document.getElementById('coinResult').textContent = result;
        }
    </script>
</body>

</html>